<!DOCTYPE html>
<html>
<head><style type="text/css">.top {border: 10px solid #525252;}
.top {background-color: #525252;}
.main {border:  50px solid #525252;}
.main {background-color: #525252;}
.Alliance {border: 10px solid #525252; background-color: #BA0B0B}
.match {border: 10px solid #525252; background-color: #ff7e00}
.title {border: 10px solid #525252; background-color: #ff7e00}
body {font-size: 2.373em; padding: 0; margin: 0;}
.top {
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 margin: auto;
 justify-content: center;
 }
.truemain {background-color: #525252} 
.teams {
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 margin: auto;
 }
.teamA {margin: 0px 25px 0px 25px}
.teamB {margin: 0px 25px 0px 25px}
.teamC {margin: 0px 25px 0px 25px}
.bigButton {
 background-color: #ff7e00;
 color: #000000;
 width: 200px;
 height: 100px;
 font-size: 80px;
 }
.truemain {
justify-content: center;
}
.teamA {border 10px solid red}
.teamB {border 10px solid red}
.teamC {border 10px solid red}
</style>



<title>Scoring App</title>
</head>
<body>
<div class= truemain>
<form action="Teleop.html">
  <div class="top">
    <!--<image src="http://www.kilkennyarms.com/wp-content/uploads/2012/09/Dark-Diamond-Plate.jpg"</image>-->
    <div class="match">
      <h2>Bridgewater Match 3: 14:57</h2>
    </div>
    <div class="title">
        <h2>Autonomous Mode</h2>
    </div>
    <div class="Alliance">
      <h2 id="Alliance">RED</h2>
    </div>
  </div>
  <div class="main">
    <div class="teams">
      <div class="teamA">
	  <h1 class="team">102</h1>
      <p>
        <input id="0" type="checkbox" name="team1" value="Bike">Robot is in Auto Zone<br>
        <input id="1" type="checkbox" name="team1" value="Bike">Tote in Auto zone<br>
<input id="2" type="radio" name="team1" value="1" checked="">1

<input id="3" type="radio" name="team1" value="2">2
          <input id="4" type="radio" name="team1" value="3">3
<br>
       <input id="5" type="checkbox" name="team1" value="Bike">Stacked Totes<br>
          <input id="6" type="checkbox" name="team1" value="Bike">Containers in Auto<br>
      </p>
	  </div>
	  <div class="teamB">
      <h1 class="team">75</h1>
      <p>
<input id="7" type="checkbox" name="team2" value="Bike">Robot is in Auto Zone<br>
        <input id="8" type="checkbox" name="team2" value="Bike">Tote in Auto zone<br>
<input id="9" type="radio" name="team2" value="1" checked="">1

<input id="10" type="radio" name="team2" value="2">2
          <input id="11" type="radio" name="team2" value="3">3
<br>
        <input id="12" type="checkbox" name="team2" value="Bike">Stacked Totes<br>
          <input id="13" type="checkbox" name="team2" value="Bike">Containers in Auto<br>
      </p>
	  </div>
	  <div class="teamC">
      <h1 class="team">303</h1>
      <p>
<input id="14" type="checkbox" name="team3" value="Bike">Robot is in Auto Zone<br>
        <input id="15" type="checkbox" name="team3" value="Bike">Tote in Auto zone<br>
<input id="16" type="radio" name="team3" value="1" checked="">1

<input id="17" type="radio" name="team3" value="2">2
        
          <input id="18" type="radio" name="team3" value="3">3
<br>
        <input id="19" type="checkbox" name="team3" value="Bike">Stacked Totes<br>
          <input id="20" type="checkbox" name="team3" value="Bike">Containers in Auto<br>
      </p>
	  </div>
	 </div>
    </div>

  <input class="bigButton" type="submit" name="Next" value="Next">
</form>
</div>

<script>/* Write JavaScript here */</script></body>